<template>
  <div class="department">
    <PageSearch
      :searchFormConfig="searchFormConfig"
      @handleReset="handleResetFn"
      @handleSearch="handleSearchFn"
    ></PageSearch>
    <PageTable
      pageName="department"
      :tableConfig="tableConfig"
      ref="pageTableRef"
      title="部门数据"
      @handleAddFn="handleAddFn"
      @handleEditFn="handleEditFn"
      AddDataName="新增部门"
    ></PageTable>
    <PageDialog
      :dialogConfig="dialogConfig"
      pageName="department"
      ref="pageDialogRef"
      :defaultInfo="defaultInfo"
    ></PageDialog>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";

import PageDialog from "@/components/page-dialog";
import { dialogConfig } from "./config/departDialogConfig";

import PageSearch from "@/components/page-search";
import { searchFormConfig } from "./config/departFormConfig";

import PageTable from "@/components/page-table";
import { tableConfig } from "./config/departTableConfig";

import { usePageSearch } from "@/hooks/usePageSearch";
import { usePageDialog } from "@/hooks/usePageDialog";
export default defineComponent({
  name: "department",
  components: {
    PageDialog,
    PageSearch,
    PageTable,
  },
  setup() {
    const { handleSearchFn, pageTableRef, handleResetFn } = usePageSearch();

    const { handleAddFn, pageDialogRef, handleEditFn, defaultInfo } =
      usePageDialog();
    return {
      tableConfig,
      searchFormConfig,
      dialogConfig,
      handleSearchFn,
      pageTableRef,
      handleResetFn,
      handleAddFn,
      pageDialogRef,
      defaultInfo,
      handleEditFn,
    };
  },
});
</script>

<style scoped></style>
